

<template>
  <div>
    <el-col :span="10">
      <el-form label-position="right" label-width="100px" :model="orderinfo">
        <el-form-item label="预交金额">
          <el-input
            v-model.number="orderinfo.money"
            type="number"
            @change="moneysumfun"
            @input="moneysumfun"
          ></el-input>
        </el-form-item>
        <el-form-item label="付款日期">
          <input
            type="datetime-local"
            step="01"
            v-model="orderinfo.apply_time"
          />
        </el-form-item>
      </el-form>
    </el-col>
    <el-col :span="24">
      <el-button class="butB_Sel" @click="printBtn()">打印1</el-button>
      <el-button class="butB_Sel" @click="printBtn2()">打印2</el-button>
    </el-col>
    <div class="app-container" id="printcons"  v-if="tabeldata.hospital_info">
      <table
        border="0"
        width="100%"
        align="center"
        cellspacing="0"
        cellpadding="0"
      >
        <tbody>
          <tr style="display: flex;">
            <td style="display: flex;flex-direction:column;flex:2">
              <h2 style="margin: 10px 5px">
                {{ his_name ? his_name : tabeldata.his_name }}住院预交款收据
              </h2>
              <table border="" cellspacing="0" cellpadding="0">
                <tr>
                  <td style="height: 30px">住院号</td>
                  <td style="height: 30px">
                    {{ tabeldata.hospital_info.ipt_no }}
                  </td>
                  <td style="height: 30px">姓名</td>
                  <td style="height: 30px">
                    {{ tabeldata.hospital_info.member.name }}
                  </td>
                  <td style="height: 30px">性别</td>
                  <td style="height: 30px">
                    {{
                      tabeldata.hospital_info.member.gender == 1
                        ? "男"
                        : tabeldata.hospital_info.member.gender == 2
                        ? "女"
                        : ""
                    }}
                  </td>
                </tr>
                <tr>
                  <td style="height: 30px">病区</td>
                  <td style="height: 30px">
                    {{ tabeldata.hospital_info.room_name }}
                  </td>
                  <td style="height: 30px"></td>
                  <td style="height: 30px"></td>
                  <td style="height: 30px">交款方式</td>
                  <td style="height: 30px">现金</td>
                </tr>
                <tr>
                  <td style="height: 30px">金额</td>
                  <td style="height: 30px">{{ orderinfo.money }}</td>
                  <td style="height: 30px">大写</td>
                  <td colspan="3">{{ damoneysum }}</td>
                </tr>
              </table>
              <p style="margin: 10px 0px; height: 30px">
                <span style="">操作员：{{ tabeldata.create_by }}</span>
                <span style="padding-left: 100px">
                  交款时间：{{ orderinfo.apply_time.split("T")[0]
                  }}{{ orderinfo.apply_time.split("T")[1] }}</span
                >
              </p>
              <p style="margin: 0rem">1、手写无效，遗失不补</p>
              <p style="margin: 0rem">2、出院时此联应交住院处据此结算</p>
              <p style="margin: 0rem">3、最终解释权属于本院住院处</p>
              <p style="margin: 10px 0px; height: 30px">
                注:此收据请在出院时务必交回
              </p>
            </td>
            <td style="display: flex; flex-direction: column;flex:1;margin-left: 40px;">
              <h2 style="margin: 10px 5px">存根</h2>
              <table border="" cellspacing="0" cellpadding="0">
                <tr>
                  <td style="height: 30px">住院科室</td>
                  <td style="height: 30px">
                    {{ tabeldata.hospital_info.department_name }}
                  </td>
                </tr>
                <tr>
                  <td style="height: 30px">姓名</td>
                  <td style="height: 30px">
                    {{ tabeldata.hospital_info.member.name }}
                  </td>
                </tr>
                <tr>
                  <td style="height: 30px">住院号</td>
                  <td style="height: 30px">
                    {{ tabeldata.hospital_info.ipt_no }}
                  </td>
                </tr>
                <tr>
                  <td style="height: 30px">交款日期</td>
                  <td style="height: 30px">
                    {{ orderinfo.apply_time.split("T")[0] }}
                  </td>
                </tr>
                <tr>
                  <td style="width:100px;height: 30px">金额</td>
                  <td style="width:100px;height: 30px">{{ orderinfo.money }}</td>
                </tr>
                <tr>
                  <td style="width:100px;height: 30px">交款方式</td>
                  <td style="width:100px;height: 30px">现金</td>
                </tr>
              </table>
              <p style="margin: 10px 0px; height: 30px">
                <span style="">操作员：{{ tabeldata.create_by }}</span>
              </p>
            </td>
          </tr>
        </tbody>
      </table>
      <!-- <div
        class=""
        style="

          margin: auto;

          padding-top: 50px;
        "
      >






      </div> -->
    </div>
  </div>
</template>
<script>
import { getPrintInvoice, getdictIndex } from "@/api/register";

import { printSettlement } from "@/api/zhuyanre";

export default {
  props: ["id"],
  data() {
    return {
      tabeldata: {},
      sourcelist: [],
      orderinfo: {
        money: 0,
        apply_time: "",
      },
      damoneysum: "",
      dayin: false,
      his_name: "",
    };
  },

  mounted() {
    this.getindex();
    this.getpint();
    console.log(process.env);
    this.his_name = process.env.VUE_APP_HOSPITAL_API;
  },
  watch: {
    id(n) {
      console.log(this.id);
      this.getpint();
    },
  },
  methods: {
    getindex() {
      getdictIndex({ group_id: "40" }).then((res) => {
        let data = res.data;
        data.forEach((item, key) => {
          if (item.id == 40) {
            this.sourcelist = item.items;
          }
        });
      });
    },
    getpint() {
      printSettlement({ hospital_id: this.id }).then((res) => {
        if (res.code == 200) {
          console.log(res.data);
          this.tabeldata = res.data;
          this.tabeldata.zongfee = 0;
          for (let i = 0; i < this.tabeldata.fee.length; i++) {
            this.tabeldata.zongfee += parseInt(this.tabeldata.fee[i].money);
          }
          // this.tabeldata.timeame=this.tabeldata.time.split(' ')[0].split('-')
        }
      });
    },
    mapxing(num) {
      var art = "";
      this.sourcelist.map(function (value, i, array) {
        if (value.id == num) {
          art = value.name;
        }
      });
      console.log(art);
      return art;
    },
    printBtn(e) {
      this.dayin = true;
      setTimeout(() => {
        this.dayinfun();
      }, 200);
    },
    printBtn2() {
      this.CreateOneFormPage();
    },
    CreateOneFormPage() {
      this.LODOP = getLodop();
      this.LODOP.ADD_PRINT_HTM(
        50,
        30,
        "100%",
        "BottomMargin:9mm",
        document.getElementById("printcons").innerHTML
      );
      this.LODOP.SET_PRINT_MODE("PRINT_PAGE_PERCENT", "Auto-Width");
      this.LODOP.SET_PRINT_STYLEA(0, "LinkedItem", -1);
      this.LODOP.PREVIEW();
    },
    moneysumfun() {
      this.damoneysum = this.AmountLtoU(this.orderinfo.money);
    },
    AmountLtoU(num) {
      ///<summery>小写金额转化大写金额</summery>
      ///<param name=num type=number>金额</param>
      if (isNaN(num)) return "";
      var strPrefix = "";
      if (num < 0) strPrefix = "(负)";
      num = Math.abs(num);
      if (num >= 1000000000000) return "无效数值！";
      var strOutput = "";
      var strUnit = "仟佰拾亿仟佰拾万仟佰拾元角分";
      var strCapDgt = "零壹贰叁肆伍陆柒捌玖";
      num += "00";
      var intPos = num.indexOf(".");
      if (intPos >= 0) {
        num = num.substring(0, intPos) + num.substr(intPos + 1, 2);
      }
      strUnit = strUnit.substr(strUnit.length - num.length);
      for (var i = 0; i < num.length; i++) {
        strOutput +=
          strCapDgt.substr(num.substr(i, 1), 1) + strUnit.substr(i, 1);
      }
      return (
        strPrefix +
        strOutput
          .replace(/零角零分$/, "整")
          .replace(/零[仟佰拾]/g, "零")
          .replace(/零{2,}/g, "零")
          .replace(/零([亿|万])/g, "$1")
          .replace(/零+元/, "元")
          .replace(/亿零{0,3}万/, "亿")
          .replace(/^元/, "零元")
      );
    },
    dayinfun() {
      this.remove_ie_header_and_footer();
      let subOutputRankPrint = document.getElementById("printcons");
      console.log(subOutputRankPrint.innerHTML);
      let newContent = subOutputRankPrint.innerHTML;
      let oldContent = document.body.innerHTML;
      document.body.innerHTML = newContent;
      window.print();
      window.location.reload();
      document.body.innerHTML = oldContent;
      return false;
    },
    //去掉页眉和页脚
    remove_ie_header_and_footer() {
      var hkey_path;
      hkey_path =
        "HKEY_CURRENT_USER\\Software\\Microsoft\\Internet Explorer\\PageSetup\\";
      try {
        var RegWsh = new ActiveXObject("WScript.Shell");
        RegWsh.RegWrite(hkey_path + "header", "");
        RegWsh.RegWrite(hkey_path + "footer", "");
      } catch (e) {}
    },
  },
};
</script>
<style media="print">
@page {
  size: auto; /* auto is the initial value */
  margin: 0mm; /* this affects the margin in the printer settings */
}
@media print {
}
body {
  -webkit-print-color-adjust: exact;
}
#printcons >>> td {
  height: 20px !important;
  width: 100px !important;
  /* border: 0.5px solid #000000; */
  padding: 0rem;
  margin: 0rem;
  text-align: center;
}
</style>
<style lang='scss' scoped>
#printcons >>> tr {
  height: 20px !important;
  padding: 20px 10px;
  margin: 0rem;
}
#printcons >>> td {
  height: 20px !important;

  /* border: 0.5px solid #000000; */
  padding: 0rem;
  margin: 0rem;
  text-align: center;
}
.app-container{
  width: 950px;
}
</style>
